<template>
  <el-card shadow="always"   body-style="{border='3px'}">
    <div slot="header" class="box-card-header">
      <div style="float: left">
        <span>{{tenantCardInfo.tenant_name}}</span>

      </div>
      <div style="float: right">
        <i class="el-icon-s-tools" @click="onTenantEdit"></i>

      </div>
    </div>
    <div class="tenant-card-area">
      <!--                card 数据列表-->
      <ol  class="tenant-card-ol">
        <li>地区：<span class="tenant-card-span">{{tenantCardInfo.province+ '-'+tenantCardInfo.city+ '-'+tenantCardInfo.city_area}}</span>
        </li>
        <li>套餐：<span class="tenant-card-span">{{tenantCardInfo.order}}</span></li>
        <li>用户量：<span class="tenant-card-span">{{tenantCardInfo.stu_num}}</span></li>
        <li>缴费比例：<span class="tenant-card-span">80%</span></li>
        <li>视频量：<span class="tenant-card-span">{{tenantCardInfo.video_num}}</span></li>
        <li>公开量：<span class="tenant-card-span">{{tenantCardInfo.video_open_num}}</span></li>
        <li>
          <div style="float:right;padding-bottom: 10px;">
            <el-switch
              v-model="isTenant_onoff"
              active-color="#13ce66"
              inactive-color="#ff4949"
              active-text="启用"
              @change="onTenantOnOff"
            >
            </el-switch>
          </div>
        </li>
      </ol>
    </div>
  </el-card>
</template>

<script>
  export default {
    name: 'index',
    data() {
      return {

        /**
         *租户信息目录
         */
        tenantCardInfo: {
          tenant_id: '',
          tenant_name: '汉唐和雅小学',
          create_at: '2021-01-16 15:49:22',
          update_at: '2021-01-16 15:49:22',
          create_by: 'cxy',
          update_by: 'cxy',
          stu_num: '1000',
          tea_num: '200',
          order: 'A',
          city_area: '桥西',
          city: '石家庄',
          province: '河北',
          video_num: '1000',
          video_open_num: '999'
        }

      }
    },
    methods:{

    }
  }
</script>

<style scoped>


  .box-card-header{
    position: relative;
    height: 30px;
    font-size: 20px;
    /*font-size: larger;*/
    font-family: 'Open Sans', Arial, sans-serif;
    /*background-color: #4AB7BD;*/
    /*img{*/
    /*  width: 50%;*/
    /*  height: 100%;*/
    /*  transition: all 0.2s linear;*/
    /*}*/
  }

  .tenant-card-area{
    /*float: left;*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*position:absolute;*/
    /*display: block;*/

  }
  .tenant-card-ol {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 80%;
    list-style: none;
    /*background-color: #4AB7BD;*/

  }

  .tenant-card-ol li {
    margin-top: 5px;
  }

</style>
